chore(web-server): use a rewriting server to get rid of bower dependency #385
Conversation
petebacondarwin
force-pushed
the
local-web-server
branch
from
bfe10fa to
acb52cd
Compare
petebacondarwin
force-pushed
the
local-web-server
branch
from
acb52cd to
59bc4c0
Compare
There was a problem hiding this comment.
I don't feel too strongly about it, but I prefer the current setup. This is seed project and I am not sure what our recommendation is for running an app in production.
With the previous setup (using bower), one could just copy /app/ and put it on a server (more or less). With this setup, they need a build step, which we don't provide.
And instead of the dependency on bower, we now have some obscure server configuration.
--
While I might prefer this new setup in my local dev environment, I am not sure it is better than the bower dependency for a basic seed project that is the basis of the tutorial and also intended to be used mainly by beginners (more advanced users will already have more advanced dev workflows set up).
It is only a slight preference though. I could go either way, so feel free to move this forward.
(If we do make this change, we also need to update README.md btw.)
| "preprotractor": "npm run update-webdriver", | ||
| "protractor": "protractor e2e-tests/protractor.conf.js", | ||
|
|
||
| "update-index-async": "node -e \"var fs=require('fs'),indexFile='app/index-async.html',loaderFile='app/bower_components/angular-loader/angular-loader.min.js',loaderText=fs.readFileSync(loaderFile,'utf-8').split(/sourceMappingURL=angular-loader.min.js.map/).join('sourceMappingURL=bower_components/angular-loader/angular-loader.min.js.map'),indexText=fs.readFileSync(indexFile,'utf-8').split(/\\/\\/@@NG_LOADER_START@@[\\s\\S]*\\/\\/@@NG_LOADER_END@@/).join('//@@NG_LOADER_START@@\\n'+loaderText+' //@@NG_LOADER_END@@');fs.writeFileSync(indexFile,indexText);\"" | ||
| "update-index-async": "node -e \"var fs=require('fs'),indexFile='app/index-async.html',loaderFile='app/lib/angular-loader/angular-loader.min.js',loaderText=fs.readFileSync(loaderFile,'utf-8').split(/sourceMappingURL=angular-loader.min.js.map/).join('sourceMappingURL=lib/angular-loader/angular-loader.min.js.map'),indexText=fs.readFileSync(indexFile,'utf-8').split(/\\/\\/@@NG_LOADER_START@@[\\s\\S]*\\/\\/@@NG_LOADER_END@@/).join('//@@NG_LOADER_START@@\\n'+loaderText+' //@@NG_LOADER_END@@');fs.writeFileSync(indexFile,indexText);\"" |
There was a problem hiding this comment.
loaderFile='app/lib/angular-loader/angular-loader.min.js should point to node_modules/ instead.
| @@ -9,10 +9,10 @@ | |||
| <title>My AngularJS App</title> | |||
| <meta name="description" content=""> | |||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |||
| <link rel="stylesheet" href="bower_components/html5-boilerplate/dist/css/normalize.css"> | |||
| <link rel="stylesheet" href="bower_components/html5-boilerplate/dist/css/main.css"> | |||
| <link rel="stylesheet" href="lib/html5-boilerplate/dist/css/normalize.css"> | |||
There was a problem hiding this comment.
Why os this needed? Previously the files were served from bower_components, why can't they just now be served from node_modules without any rewriting server?
There was a problem hiding this comment.
Because the root directory (for the webapp) is app/ which is a sibling of node_module/.
There was a problem hiding this comment.
I see. And in package.json it's not possible to specify an alternative location of node_modules.
There was a problem hiding this comment.
We could create a separate package.json inside app/. ;)
There was a problem hiding this comment.
We could. I did think about that. But I felt that might be more confusing than helpful.
And in reality, and real project is going to have a build step of some kind, right?
There was a problem hiding this comment.
In that case it might be better to do the following in the build process:
- Remove
app/dist/ - Copy relevant files to
app/dist/
jQuery uses the npmcopy Grunt task for this[1] but regular copying should work as well.
I'd like the official seed to stop using Bower as we're discouraging its use so we're not following our own advice if we keep using it.
[1] https://github.com/jquery/jquery/blob/7fbab88/Gruntfile.js#L78-L104
EDIT: Clarified the description a little.
There was a problem hiding this comment.
I would rather not introduce a task runner (grunt, gulp etc). Everyone will have a different preference and this seed project has been tranditionally quite unopinionated. Also, keep n mind that angular-seed is used as a base for angular-phonecat, so simplicity is a feature 😃
How about using an npm script (e.g. postinstall) that copies the necessary files from node_modules/... to app/lib/? It is still less straightforward than bower install imo, but more straightforward than using a task runner or a rewriting server. WDYT?
There was a problem hiding this comment.
@gkalpak That's exactly what I proposed in my last comment...
There was a problem hiding this comment.
Ooops, I thought you were proposing to use Grunt 😁
There was a problem hiding this comment.
No, I just gave an example of how jQuery does it. :) The details of the copying mechanisms are not the most important parts.
This is an alternative to angular#385. Closes angular#385
|
Here is the alternative approach discussed above: #389 |
This is an alternative to angular#385. Closes angular#385
|
Closing as there is no interest in landing this. |
No description provided.